<script setup lang="ts">
defineProps<{
  /**允许横向滚动 */
  "scroll-x"?: boolean;
  /**允许纵向滚动 */
  "scroll-y"?: boolean;
  /**距顶部/左边多远时（单位px），触发 scrolltoupper 事件 */
  "upper-threshold"?: StrNumber;
  /**距底部/右边多远时（单位px），触发 scrolltolower 事件 */
  "lower-threshold"?: StrNumber;
  /**设置竖向滚动条位置 */
  "scroll-top"?: StrNumber;
  /**设置横向滚动条位置 */
  "scroll-left"?: StrNumber;
  /**值应为某子元素id（id不能以数字开头）。设置哪个方向可滚动，则在哪个方向滚动到该元素 */
  "scroll-into-view"?: string;
  /**在设置滚动条位置时使用动画过渡	 */
  "scroll-with-animation"?: boolean;
  /**iOS点击顶部状态栏、安卓双击标题栏时，滚动条返回顶部，只支持竖向 */
  "enable-back-to-top"?: boolean;
  /**控制是否出现滚动条 */
  "show-scrollbar"?: boolean;
  /**开启自定义下拉刷新 */
  "refresher-enabled"?: boolean;
  /**设置自定义下拉刷新阈值 */
  "refresher-threshold"?: number;
  /**设置自定义下拉刷新默认样式 */
  "refresher-default-style"?: "black" | "white" | "none";
  /**设置自定义下拉刷新区域背景颜色 */
  "refresher-background"?: string;
  /**设置当前下拉刷新状态，true 表示下拉刷新已经被触发，false 表示下拉刷新未被触发 */
  "refresher-triggered"?: boolean;
  /**启用 flexbox 布局。开启后，当前节点声明了 display: flex 就会成为 flex container，并作用于其孩子节点。 */
  "enable-flex"?: boolean;
  /**开启 scroll anchoring 特性，即控制滚动位置不随内容变化而抖动，仅在 iOS 下生效，安卓下可参考 CSS overflow-anchor 属性 */
  "scroll-anchoring"?: boolean;
}>();
defineEmits<{
  /**滚动到顶部/左边，会触发 scrolltoupper 事件 */
  (e: "scrolltoupper", v: any): void;
  /**滚动到底部/右边，会触发 scrolltolower 事件 */
  (e: "scrolltolower", v: any): void;
  /**滚动时触发，event.detail = {scrollLeft, scrollTop, scrollHeight, scrollWidth, deltaX, deltaY} */
  (e: "scroll", v: any): void;
  /**自定义下拉刷新控件被下拉 */
  (e: "refresherpulling", v: any): void;
  /**自定义下拉刷新被触发 */
  (e: "refresherrefresh", v: any): void;
  /**自定义下拉刷新被复位 */
  (e: "refresherrestore", v: any): void;
  /**自定义下拉刷新被中止 */
  (e: "refresherabort", v: any): void;
}>();
</script>

<template>
  <slot></slot>
</template>
